<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Loan蓝黛</title>
    <link rel="stylesheet" href="./dist/css/borrow_info.min.css">
    <link rel="stylesheet" href="./lib/bootstrap4/css/bootstrap.css">
    <link rel="stylesheet" href="./lib/echarts/echarts.min.js">

</head>

<body>
    <!-- 顶部部分 -->
    <div class="top-nav">
        <nav class="navbar navbar-expand-lg ">
            <div class="container ">
                <a class="navbar-brand" href="#">
                    <svg t="1637030517147" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="2272" width="32" height="32">
                        <path
                            d="M682.666667 398.222222c13.653333 15.928889 27.306667 31.857778 40.96 45.511111 11.377778 13.653333 25.031111 29.582222 40.96 47.786667s29.582222 34.133333 45.511111 52.337778c20.48 22.755556 36.408889 43.235556 50.062222 61.44 13.653333 18.204444 22.755556 34.133333 31.857778 50.062222 6.826667 15.928889 13.653333 29.582222 15.928889 40.96 2.275556 13.653333 4.551111 25.031111 4.551111 38.684444v59.164445c0 18.204444-2.275556 34.133333-9.102222 50.062222-6.826667 13.653333-13.653333 27.306667-25.031112 38.684445-11.377778 11.377778-22.755556 18.204444-36.408888 25.031111-13.653333 6.826667-27.306667 9.102222-43.235556 9.102222H234.382222c-15.928889 0-31.857778-2.275556-47.786666-9.102222-15.928889-4.551111-27.306667-13.653333-38.684445-22.755556s-20.48-22.755556-27.306667-36.408889c-6.826667-13.653333-11.377778-29.582222-11.377777-47.786666v-70.542223c0-13.653333 2.275556-29.582222 4.551111-40.96 2.275556-13.653333 6.826667-27.306667 15.928889-40.96 6.826667-18.204444 15.928889-31.857778 29.582222-50.062222 13.653333-15.928889 29.582222-34.133333 47.786667-54.613333 15.928889-18.204444 31.857778-34.133333 50.062222-52.337778 15.928889-18.204444 31.857778-34.133333 45.511111-47.786667 15.928889-15.928889 31.857778-31.857778 45.511111-47.786666H682.666667z m-170.666667 345.884445c15.928889 0 31.857778-2.275556 45.511111-9.102223 13.653333-6.826667 27.306667-13.653333 36.408889-25.031111 11.377778-11.377778 18.204444-22.755556 25.031111-36.408889 6.826667-13.653333 9.102222-29.582222 9.102222-45.511111s-2.275556-31.857778-9.102222-45.511111c-6.826667-13.653333-13.653333-27.306667-25.031111-36.408889-11.377778-11.377778-22.755556-18.204444-36.408889-25.031111-13.653333-6.826667-29.582222-9.102222-45.511111-9.102222s-31.857778 2.275556-45.511111 9.102222c-13.653333 6.826667-27.306667 13.653333-36.408889 25.031111-11.377778 11.377778-18.204444 22.755556-25.031111 36.408889-6.826667 13.653333-9.102222 29.582222-9.102222 45.511111s2.275556 31.857778 9.102222 45.511111c6.826667 13.653333 13.653333 27.306667 25.031111 36.408889 11.377778 11.377778 22.755556 18.204444 36.408889 25.031111 13.653333 6.826667 29.582222 9.102222 45.511111 9.102223z m457.386667-457.386667v56.888889c0 15.928889-4.551111 29.582222-15.928889 40.96-11.377778 11.377778-25.031111 15.928889-40.96 15.928889h-113.777778c-15.928889 0-29.582222-4.551111-40.96-15.928889-11.377778-11.377778-15.928889-25.031111-15.928889-40.96v-56.888889H282.168889v56.888889c0 15.928889-4.551111 29.582222-15.928889 40.96-11.377778 11.377778-25.031111 15.928889-40.96 15.928889h-113.777778c-15.928889 0-29.582222-4.551111-40.96-15.928889-11.377778-11.377778-15.928889-25.031111-15.928889-40.96v-59.164445c0-6.826667 2.275556-13.653333 4.551111-18.204444l13.653334-13.653333c4.551111-4.551111 11.377778-9.102222 18.204444-11.377778 6.826667-2.275556 13.653333-6.826667 20.48-11.377778 6.826667-4.551111 22.755556-11.377778 45.511111-25.031111 22.755556-11.377778 52.337778-25.031111 88.746667-38.684444 36.408889-13.653333 75.093333-25.031111 120.604444-36.408889s93.297778-15.928889 145.635556-15.928889c59.164444 0 111.502222 4.551111 157.013333 15.928889 45.511111 11.377778 86.471111 22.755556 120.604445 36.408889 34.133333 13.653333 61.44 27.306667 81.92 38.684444 20.48 11.377778 34.133333 20.48 40.96 25.031111 6.826667 4.551111 13.653333 9.102222 20.48 11.377778 6.826667 2.275556 13.653333 6.826667 18.204444 11.377778l13.653334 13.653333c2.275556 4.551111 4.551111 11.377778 4.551111 20.48z m0 0"
                            fill="#ffffff" p-id="2273"></path>
                    </svg>
                    <i>028-86261949</i>
                </a>
                <div class="collapse navbar-collapse" id="navbarSupportedContent ">
                    <ul class="navbar-nav ">
                        <li class="nav-item">
                            <a class="nav-link" href="index.html">首页</a>
                        </li>
                        <li class="nav-item login-text">
                            <!-- 在index.js根据登陆状态动态生成 -->
                            <!-- <a class="nav-link" href="./login.html">登陆</a> -->
                        </li>
                        <li class="nav-item reg-text">
                            <!-- 在index.js根据登陆状态动态生成 -->
                            <!-- <a class="nav-link" href="#">注册</a> -->
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="/#personal">个人中心</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#contact">联系我们</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#help">帮助</a>
                        </li>

                    </ul>

                </div>
            </div>
        </nav>
    </div>
    <!-- 内容导航 -->
    <div class="content-nav">
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <div class="container">
                <a class="navbar-brand" href="#">
                    <img src="images/logo.png" alt="">
                </a>

                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <ul class="navbar-nav mr-auto">
                        <li class="nav-item active">
                            <a class="nav-link " href="/#home">首页</a>
                        </li>
                        <li class="nav-item active">
                            <a class="nav-link" href="/#invest">我要投资 </a>
                        </li>
                        <li class="nav-item active">
                            <a class="nav-link" href="/#borrow">我要借款 </a>
                        </li>
                        <li class="nav-item active">
                            <a class="nav-link " href="/#personal">个人中心</a>
                        </li>
                        <li class="nav-item active">
                            <a class="nav-link active" href="/#personal">借款列表</a>
                        </li>

                    </ul>

                </div>
            </div>
        </nav>
    </div>
    <!--主体部分  -->
    <main class="main">
        <div class="container">
            <div class="row detail-head">
                <div class="col-md-1"></div>
                <div class="col-md-3">
                    <ul class="list-group">
                        <li class="list-group-item bg-color">借款人</li>
                        <li class="list-group-item">
                            <div class="head">
                                <img src="images/head_icon.jpg" alt="">

                            </div>
                            <div class="userid">2</div>
                            <p>
                                <span>籍贯：</span>
                                <span>广东-广州</span>
                            </p>
                            <p>
                                <span>专职客服：</span>
                                <span>码妹妹</span>
                            </p>
                            <p>
                                <span>认证信息：</span>
                                <span><img src="images/person_icon.png" alt=""></span>
                            </p>
                        </li>

                    </ul>

                </div>
                <div class="col-md-4 col-md-main">

                    <h4><span class="userid"></span>借款</h4>

                    <p>
                        <span>借款金额</span>
                        <span class="borrowmoney"></span>

                    </p>
                    <p>
                        <span>年化利率</span>
                        <span class="interest"></span>
                        <span>%</span>
                    </p>
                    <p>
                        <span>借款期限</span>
                        <span class="days">100</span>
                    </p>
                    <p>
                        <span>投标奖励</span>
                        <span class="bouns"></span>
                    </p>
                    <p>
                        <span>还款方式</span>
                        <span class="repaytype"></span>
                    </p>
                    <p>
                        <span>最小投标</span>
                        <span class="minbid"></span>
                    </p>
                </div>
                <div class="col-md-4">
                    <div id="main" style="width: 400px;height:300px;">

                    </div>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row detail-head">
                <div class="col-md-1"></div>
                <div class="col-md-11">
                    <ul class="list-group">
                        <li class="list-group-item bg-color">借款人信息</li>
                        <li class="list-group-item">
                            <p>
                                <span>借款人标题：</span>
                                <span class="title"></span>
                            </p>
                            <p>
                                <span>借款人理由：</span>
                                <span class="info"></span>
                            </p>
                            <p>
                                <input type="number" class="form-control" id="investmoney" style="width: 20%;">
                            </p>
                            <p>

                                <button class="btn btn-info" id="invest">投资</button>
                            </p>
                        </li>

                    </ul>

                </div>

            </div>
        </div>

    </main>



    <!-- 底部部分 -->
    <div class="footer">
        <div class="container">
            <div class="row">
                <div class="col-md-8">
                    <p> 专业、安全、高利息</p>
                    <p> 版权所有： &copy 2020-2021广东白云学院</p>
                    <p> 地  址： 广东白云学院江高镇</p>
                    <p> 电  话： 000-123456 / 400-800-900 邮箱： personal@baiyun.cn</p>
                    <p> 蜀ICP备14030149号-1  蜀公网安备510114990541</p>
                </div>
                <div class="col-md-2">
                    <p>官方微博</p>
                    <img src="images/tecent.png" alt="">
                    <img src="images/sina.png" alt="">
                </div>
                <div class="col-md-2">
                    <p>官方微信</p>
                    <img src="images/sina.png" alt="">
                </div>
            </div>

        </div>
    </div>










    <script src="./lib/jquery/jquery.js"></script>
    <script src="./lib/echarts/echarts.min.js"></script>
    <script src="./dist/js/borrow_info.min.js"></script>


</body>

</html>